<?xml version='1.0' encoding='UTF-8' ?>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:rich="http://richfaces.org/rich"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:a4j="http://richfaces.org/a4j">
    <body>
        <ui:composition template="/common/templates/common.xhtml">
            <ui:param name="titulo" value="Creación de Promociones" />

            <ui:define name="body">
                <h:form>
                    <a4j:keepAlive beanName="PromocionesBean"/>
                    <a4j:region>
                        <rich:dataTable value="#{PromocionesBean.muebles}"
                            var="mueble" id="tabla" rows="3">
                            <f:facet name="header">
                                <h:outputText value="Lista de productos para Promoción"/>
                            </f:facet>
                            <rich:column>
                                <f:facet name="header">
                                    <h:outputText value="Referencia" />
                                </f:facet>
                                <h:outputText value="#{mueble.referencia}" id="referencia" />
                            </rich:column>
                            <rich:column>
                                <f:facet name="header">
                                    <h:outputText value="Nombre" />
                                </f:facet>
                                <h:outputText value="#{mueble.nombre}" id="nombre" />
                            </rich:column>
                            <rich:column>
                                <f:facet name="header">
                                    <h:outputText value="Material" />
                                </f:facet>
                                <h:outputText value="#{mueble.nombre}" id="material" />
                            </rich:column>
                            <rich:column>
                                <f:facet name="header">
                                    <h:outputText value="Foto" />
                                </f:facet>

                                <a4j:commandLink ajaxSingle="true" id="verProducto"
                                    oncomplete="javascript:Richfaces.showModalPanel('panelVer',{width:450, top:200})">

                                        <h:graphicImage value="/ServletImage?image=#{mueble.foto}" style="border:0"/>
                                        <f:setPropertyActionListener value="#{mueble}"
                                        target="#{PromocionesBean.muebleSeleccionado}" />
                                </a4j:commandLink>

                            </rich:column>
                            <f:facet name="footer">
                                <rich:datascroller id="dataScroll">
                                </rich:datascroller>
                            </f:facet>
                        </rich:dataTable>
                    </a4j:region>
                </h:form>
                <rich:modalPanel id="panelVer" autosized="true" width="450">
                    <f:facet name="header">
                        <h:outputText value="Detalles del mueble seleccionado para la Promoción" />
                    </f:facet>
                    <rich:messages passedLabel="Data is allowed to be stored." layout="list">
                        <f:facet name="header">
                            <h:outputText value="Entered Data Status:"></h:outputText>
                        </f:facet>
                        <f:facet name="infoMarker">
                            <h:graphicImage  value="/img/passed_.gif" />
                        </f:facet>
                        <f:facet name="errorMarker">
                            <h:graphicImage value="/img/error_.gif" />
                        </f:facet>
                    </rich:messages>
                    <h:form  style="align: center;">
                        <a4j:keepAlive beanName="PromocionesBean"/>
                        <h:panelGrid columns="1" style="align: center;">
                            <a4j:outputPanel ajaxRendered="true"  style="align: center;">
                                <h:panelGrid columns="2" rendered="#{PromocionesBean.mostrarCrear}">
                                    <h:outputText value="Referencia" styleClass="texto_azul_bold"/>
                                    <h:outputText value="#{PromocionesBean.muebleSeleccionado.referencia}" />
                                    <h:outputText value="Color" styleClass="texto_azul_bold"/>
                                    <h:outputText value="#{PromocionesBean.muebleSeleccionado.color}" />
                                    <h:outputText value="Descripcion" styleClass="texto_azul_bold" />
                                    <h:outputText value="#{PromocionesBean.muebleSeleccionado.descripcion}"/>
                                    <h:outputText value="Nombre" styleClass="texto_azul_bold"/>
                                    <h:outputText value="#{PromocionesBean.muebleSeleccionado.nombre}"/>
                                    <h:outputText value="Tipo de Mueble" styleClass="texto_azul_bold"/>
                                    <h:outputText id="idtipo" value="#{PromocionesBean.muebleSeleccionado.tipoMueble}"/>
                                    <h:outputText value="Material" styleClass="texto_azul_bold"/>
                                    <h:outputText id="idmaterial" value="#{PromocionesBean.muebleSeleccionado.material}"/>
                                    <h:outputText value="Alto" styleClass="texto_azul_bold"/>
                                    <h:outputText id="idalto" value="#{PromocionesBean.muebleSeleccionado.dimension.alto}"/>
                                    <h:outputText value="Ancho" styleClass="texto_azul_bold"/>
                                    <h:outputText id="idancho" value="#{PromocionesBean.muebleSeleccionado.dimension.ancho}"/>
                                    <h:outputText value="Profundidad" styleClass="texto_azul_bold"/>
                                    <h:outputText id="idprofundidad" value="#{PromocionesBean.muebleSeleccionado.dimension.profundidad}"/>
                                    <h:outputText value="Color" styleClass="texto_azul_bold"/>
                                    <h:outputText id="idcolor" value="#{PromocionesBean.muebleSeleccionado.color}"/>
                                    <h:outputText value="Peso" styleClass="texto_azul_bold"/>
                                    <h:outputText id="idpeso" value="#{PromocionesBean.muebleSeleccionado.peso}"/>
                                    <h:outputLabel value="Fecha de Inicio:" id="l_fechaI"  styleClass="texto_azul_bold"/>
                                    <rich:calendar id="t_fechaI" value="#{PromocionesBean.fechaInicio}"
                                        locale="es/CO" popup="true" datePattern="dd.MM.yyyy" showApplyButton="false">
                                    </rich:calendar>
                                    <h:outputLabel value="Fecha de Fin:" id="l_fechaF"  styleClass="texto_azul_bold"/>
                                    <rich:calendar id="t_fechaF" value="#{PromocionesBean.fechaFin}"
                                        locale="es/CO" popup="true" datePattern="dd.MM.yyyy" showApplyButton="false">
                                    </rich:calendar>
                                </h:panelGrid>
                                <h:panelGrid columns="2">
                                    <a4j:commandButton value="Crear Promocion" rendered="#{PromocionesBean.mostrarCrear}"
                                        action="#{PromocionesBean.crearPromocion}"  style="align: center;"/>
                                    <a4j:commandButton value="Cerrar"
                                        oncomplete="javascript:Richfaces.hideModalPanel('panelVer')"
                                        action="#{PromocionesBean.cancelarPromocion}"  style="align: center;"/>
                                </h:panelGrid>
                            </a4j:outputPanel>
                        </h:panelGrid>
                    </h:form>
                </rich:modalPanel>
            </ui:define>
        </ui:composition>
    </body>
</html>         